import React, { useEffect, useState } from 'react';
import { Row, Col, Button, Space, Avatar, Tag } from 'antd';
import "./HealthDatas.scss"
import Index from '../../../../../api/Inedx';
import { useNavigate } from 'react-router-dom';
import { useDispatch } from 'react-redux';
interface Props {
    residentId: any,
}
function HealthDatas(props: Props) {
    // console.log(props.residentId);
    let [detail, setDetail]: any = useState({})
    let dispatch = useDispatch()
    let navgate = useNavigate()
    let getdetail = async () => {
        let res = await Index.Resident.ResidentDetail({ residentId: props.residentId })
        console.log(res);
        setDetail(res.data.data)
        dispatch({ type: "SAVE_DETAIL", payload: res.data.data })
    }
    useEffect(() => {
        getdetail()
    }, [])
    let changeUserTag = (rtId: any) => {
        switch (rtId) {
            case 1:
                return (<Tag color="geekblue">高血压</Tag>)
                break;
            case 2:
                return (<Tag color="red">冠心病</Tag>)
                break;
            case 3:
                return (<Tag color="orange">高血糖</Tag>)
                break;
            case 4:
                return (<Tag color="red">高血脂</Tag>)
                break;
            case 5:
                return (<Tag color="red">慢病护理</Tag>)
                break;
            case 6:
                return (<Tag color="red">多动症</Tag>)
                break;
            default:
                break;
        }
    }
    let changeBloodTag = (Id: any) => {
        switch (Id) {
            case 1:
                return (<Tag color="geekblue">A型</Tag>)
                break;
            case 2:
                return (<Tag color="red">B型</Tag>)
                break;
            case 3:
                return (<Tag color="orange">O型</Tag>)
                break;
            case 4:
                return (<Tag color="red">AB型</Tag>)
                break;
            case 5:
                return (<Tag color="red">不详</Tag>)
                break;
            default:
                break;
        }
    }
    let changeExpressTag = (Id: any) => {
        switch (Id) {
            case 1:
                return (<Tag color="geekblue">自费</Tag>)
                break;
            case 2:
                return (<Tag color="red">社会医疗保险</Tag>)
                break;
            case 3:
                return (<Tag color="orange">商业保险</Tag>)
                break;
            case 4:
                return (<Tag color="error">新农合</Tag>)
                break;
            case 5:
                return (<Tag color="blue">其他</Tag>)
                break;
            default:
                break;
        }
    }
    let changeDegreeTag = (Id: any) => {
        switch (Id) {
            case 1:
                return (<Tag color="geekblue">小学</Tag>)
                break;
            case 2:
                return (<Tag color="red">初中</Tag>)
                break;
            case 3:
                return (<Tag color="orange">高中/中专</Tag>)
                break;
            case 4:
                return (<Tag color="red">大专</Tag>)
                break;
            case 5:
                return (<Tag color="red">本科</Tag>)
                break;
            case 6:
                return (<Tag color="red">研究生</Tag>)
                break;
            case 7:
                return (<Tag color="red">博士</Tag>)
                break;
            default:
                break;
        }
    }
    let changeMarriageTag = (Id: any) => {
        switch (Id) {
            case 1:
                return (<Tag color="geekblue">未婚</Tag>)
                break;
            case 2:
                return (<Tag color="red">已婚</Tag>)
                break;
            case 3:
                return (<Tag color="orange">离异</Tag>)
                break;
            case 4:
                return (<Tag color="red">丧偶</Tag>)
                break;
            case 5:
                return (<Tag color="red">不详</Tag>)
                break;
            default:
                break;
        }
    }
    let changeNationTag = (Id: any) => {
        switch (Id) {
            case 1:
                return (<Tag color="geekblue">汉族</Tag>)
                break;
            case 2:
                return (<Tag color="red">回族</Tag>)
                break;
            case 3:
                return (<Tag color="orange">藏族</Tag>)
                break;
            case 4:
                return (<Tag color="red">壮族</Tag>)
                break;
            case 5:
                return (<Tag color="red">彝族</Tag>)
                break;
            case 6:
                return (<Tag color="red">其他少数民族</Tag>)
                break;
            default:
                break;
        }
    }
    return (
        <div className='healthdatas'>
            <div className='title2'>居民信息</div>
            <div>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>居民编号&nbsp;{detail.residentId}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>姓名&nbsp;{detail.residentName}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>头像&nbsp;<Avatar size={64} src={detail.residentImg} alt="" /></div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>身份证号&nbsp;{detail.residentNumber}</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>手机号码&nbsp;{detail.residentPhone}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>现居地&nbsp;{detail.residentNowAddress}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>登录密码&nbsp;{detail.residentPassword}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>行政区划&nbsp;{detail.residentRegion}</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>居民标签&nbsp;{changeUserTag(detail.rtId)}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>性别&nbsp;{detail.residentGender}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>出生日期&nbsp;{detail.residentBirth}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>籍贯&nbsp;{detail.residentOriginAddress}</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>民族&nbsp;{changeNationTag(detail.nationId)}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>文化程度&nbsp;{changeDegreeTag(detail.degreeId)}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>婚姻状况&nbsp;{changeMarriageTag(detail.marriageId)}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>职业&nbsp;{detail.residentJob}</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>工作单位&nbsp;{detail.residentCompany}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>户籍类型&nbsp;{detail.residentType}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>费用类型{changeExpressTag(detail.etId)}</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>定点医疗单位&nbsp;{detail.residentHospital}</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>来源&nbsp;{"用户注册"}</div>
                    </Col>
                </Row>
            </div>
            <div>
                <div className='title3'>健康信息</div>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>身高&nbsp;{detail.healthHeight}&nbsp;cm</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>体重&nbsp;{detail.healthWeight}&nbsp;kg</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>血型&nbsp;{changeBloodTag(detail.bloodId)}&nbsp;</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>RH阴性&nbsp;{detail.healthRh}&nbsp;</div>
                    </Col>
                </Row>
                <Row gutter={[16, 16]} className="row">
                    <Col className="gutter-row" span={6}>
                        <div>过敏史&nbsp;{detail.healthGuomin ? detail.healthGuomin : "无"}&nbsp;</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>既往史&nbsp;{detail.healthJiwang ? detail.healthJiwang : "无"}&nbsp;</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>就诊史&nbsp;{detail.healthJiuzhen ? detail.healthJiuzhen : "无"}&nbsp;</div>
                    </Col>
                    <Col className="gutter-row" span={6}>
                        <div>家族病史&nbsp;{detail.healthJiazu ? detail.healthJiazu : "无"}&nbsp;</div>
                    </Col>
                </Row>
            </div>
            <div>
                <Space>
                    <Button type="primary" onClick={() => { navgate("/index/perfectdatas") }}>编辑档案信息</Button>
                    <Button onClick={() => { navgate(-1) }}>返回</Button>
                </Space>
            </div>
        </div>
    );
}

export default HealthDatas;